<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item prop="carNumber"
        >开班时间：{{ opo.classStartDate }} 班结人：{{ opo.classStructureMan }}
      </el-form-item>
      <el-form-item>
        <el-button
          icon="el-icon-plus"
          type="primary"
          v-if="isclose"
          size="mini"
          v-hasPermi="['station:structure:add']"
          @click="handleAdd"
          >添加班结</el-button
        >
      </el-form-item>
    </el-form>
    <!--按员工汇总-->
    <span style="color: #ff9955; font-size: 25px">|</span
    ><span style="font-size: 25px">按员工汇总</span>
    <el-table
      v-loading="loading"
      show-summary
      :data="structureList"
      :summary-method="getTotal"
    >
      <el-table-column label="员工姓名" align="left" prop="oilPersonnel" />
      <el-table-column label="负责枪号" align="left" prop="oilGun" />
      <el-table-column label="销量" align="left" prop="orderLiters" />
      <el-table-column label="销额" align="left" prop="amt" />
      <el-table-column label="销售笔数" align="left" prop="orderNo" />
    </el-table>
    <!--按油品汇总-->
    <span style="color: #ff9955; font-size: 25px; padding-top: 15px">|</span
    ><span style="font-size: 25px">按油品汇总</span>
    <el-table
      v-loading="loading"
      :data="structureList1"
      show-summary
      :summary-method="getTotal2"
    >
      <el-table-column label="油品" align="left" prop="oilName" />
      <el-table-column label="负责枪号" align="left" prop="oilGun" />
      <el-table-column label="销量" align="left" prop="orderLiters" />
      <el-table-column label="销额" align="left" prop="amt" />
      <el-table-column label="销售笔数" align="left" prop="orderNo" />
    </el-table>
    <!--按员工/支付方式汇总：    -->
    <span style="color: #ff9955; font-size: 25px; padding-top: 15px">|</span
    ><span style="font-size: 25px">按员工/支付方式汇总</span>
    <el-table
      v-loading="loading"
      :data="structureList3"
      show-summary
      :summary-method="getTotal3"
    >
      <el-table-column label="员工姓名" align="left" prop="oilPersonnel" />
      <el-table-column label="负责枪号" align="left" prop="oilGun" />
      <el-table-column label="微信笔数" align="left" prop="wxNum" />
      <el-table-column label="支付宝笔数" align="left" prop="zfbNum" />
      <el-table-column label="现金笔数" align="left" prop="xjNum" />
      <el-table-column label="优惠" align="left" prop="discountAmt" />
      <el-table-column label="优惠劵" align="left" prop="discountCouponAmt" />
      <el-table-column label="微信金额" align="left" prop="wxAmt" />
      <el-table-column label="支付宝金额" align="left" prop="zfbAmt" />
      <el-table-column label="现金金额" align="left" prop="xjAmt" />
      <el-table-column label="会员卡支付" align="left" prop="memberAmt" />
    </el-table>
    <!-- 添加或修改班结管理对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <span>请确认没有车主使用系统支付</span>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listPersonnelPayStructure,
  listClass,
  getAgeClassStructure,
  listPersonnelStructure,
  listOilStructure,
  addStructure,
  getPayOrderInfoMin,
  selectPersonnelStructure,
  selectPersonnelPayStructure,
  selectOilStructure,
} from "@/api/station/structure";

export default {
  name: "Structure",
  data() {
    return {
      // 遮罩层
      loading: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 班结管理表格数据
      structureList: [],
      structureList1: [],
      structureList3: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      //是否显示班结
      isclose: true,
      // 查询参数
      queryParams: {},
      stationOptions: [],
      opo: {
        classStructureMan: null,
        classStartDate: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
    };
  },
  created() {
    this.loading = false;
    let classesNo = this.$route.query.classesNo;
    //这是班结报表查看详情时传过来的数据
    if (classesNo != null) {
      this.resetQuery();
      this.queryParams.classStructureMan = this.$route.query.name;
      this.queryParams.classStructureNo = this.$route.query.classesNo;
      this.queryParams.stationId = this.$route.query.stationId;
      this.getClassInfo();
      this.isclose = false;
    } else {
      //初始化数据，在数据中查询上次班结结束时间，这里登陆人，还不能是员工，员工不能登陆，我们只能默认这里的数据是写死的油站
      getAgeClassStructure().then((response) => {
        if (response.hasOwnProperty("data")) {
          this.opo.classStartDate = response.data.classStructureDate;
        } else {
          //查询第一比订单的创建时间
          getPayOrderInfoMin().then((response1) => {
            {
              this.opo.classStartDate = response1.data.createdDate;
            }
          });
        }
        this.opo.classStructureMan = this.$store.state.user.name;
      });
      this.initPersonnelStructure();
      this.initOilStructure();
      this.initPersonnelPayStructure();
    }
  },
  activated() {
    this.loading = false;
    let classesNo = this.$route.query.classesNo;
    if (classesNo != null) {
      this.resetQuery();
      this.queryParams.classStructureNo = this.$route.query.classesNo;
      this.queryParams.stationId = this.$route.query.stationId;
      this.queryParams.stationName = this.$route.query.name;
      this.getClassInfo();
      this.isclose = false;
    }
  },
  methods: {
    // 初始化数据按员工汇总
    initPersonnelStructure() {
      selectPersonnelStructure().then((response) => {
        this.structureList = response.rows;
        this.loading = false;
      });
    },
    // 初始化数据根据油品汇总
    initOilStructure() {
      selectOilStructure().then((response) => {
        this.structureList1 = response.rows;
        this.loading = false;
      });
    },
    // 初始化数据根据员工/支付方式汇总
    initPersonnelPayStructure() {
      selectPersonnelPayStructure().then((response) => {
        this.structureList3 = response.rows;
        this.loading = false;
      });
    },
    /** 查询班结管理列表 */
    getList() {
      this.loading = true;
      listPersonnelStructure(this.queryParams).then((response) => {
        this.structureList = response.rows;
        this.loading = false;
      });
    },
    getList2() {
      this.loading = true;
      listOilStructure(this.queryParams).then((response) => {
        this.structureList1 = response.rows;
        this.loading = false;
      });
    },
    getList3() {
      this.loading = true;
      listPersonnelPayStructure(this.queryParams).then((response) => {
        this.structureList3 = response.rows;
        this.loading = false;
      });
    },
    getTotal(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "orderLiters") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "amt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "orderNo") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else {
          sums[index] = "";
        }
      });
      return sums;
    },
    getTotal2(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "orderLiters") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "amt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "orderNo") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else {
          sums[index] = "";
        }
      });
      return sums;
    },
    getTotal3(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "wxNum") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else if (column.property === "zfbNum") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else if (column.property === "xjNum") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else if (column.property === "discountAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "discountCouponAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "wxAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "zfbAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "xjAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "memberAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else {
          sums[index] = "";
        }
      });
      return sums;
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        stationId: null,
        stationName: null,
        person: null,
        gunNo: null,
        salesVolume: null,
        salesAmount: null,
        discount: null,
        coupon: null,
        netReceipts: null,
        salesNum: null,
        printNum: null,
        classStructureNo: null,
        classStructureDate: null,
        classStructureMan: null,
      };
      this.resetForm("form");
    },
    resetQuery() {
      this.queryParams = {};
      this.resetForm("queryForm");
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      if (
        this.structureList3 == null &&
        this.structureList1 == null &&
        this.structureList2 == null
      ) {
        this.msgSuccess("没有要班结的数据");
      } else {
        this.open = true;
        this.title = "添加班结管理";
      }
    },
    getClassInfo() {
      listClass(this.queryParams).then((response) => {
        this.opo = response.data;
        this.queryParams.classStructureNo = response.data.classStructureNo;
        this.queryParams.stationId = response.data.stationId;
        this.getList();
        this.getList2();
        this.getList3();
      });
    },
    /** 提交按钮 */
    submitForm() {
      //获取当前登录人信息
      //根据获取的用户信息来生成班结数据
      this.form.stationName = this.$store.state.user.stationName;
      this.form.stationId = this.$store.state.user.stationId;
      this.form.classStructureMan = this.$store.state.user.name;
      addStructure(this.form).then((response) => {
        this.msgSuccess("班结成功");
        this.open = false;
        this.queryParams.stationName = this.$store.state.user.stationName;
        this.queryParams.stationId = this.$store.state.user.stationId;
        this.queryParams.classStructureMan = this.$store.state.user.name;
        this.getClassInfo();
        this.isclose = false;
      });
    },
  },
};
</script>
